import React, { Component } from "react";
import { Text, View, TouchableOpacity } from "react-native";
import { Modal } from "@ant-design/react-native";

import styles from "./styles";

export default class AlertModal extends Component {
  render() {
    const { ModalVisible, onClose, data, updateType, type = 0 } = this.props;
    return (
      <Modal
        popup
        visible={ModalVisible}
        onClose={onClose}
        animationType="slide-up"
        maskClosable
        closable
      >
        <View style={styles.root}>
          <View style={styles.mid}>
            {data.map(item => {
              return (
                <View style={styles.group} key={item.codeId}>
                  <TouchableOpacity
                    style={{ width: "100%" }}
                    onPress={() => {
                      updateType(type, item.codeValue);
                    }}
                  >
                    <View
                      style={{
                        ...styles.subGroup,
                      }}
                    >
                      <Text style={styles.text}>{item.codeName}</Text>
                    </View>
                  </TouchableOpacity>
                  <View style={styles.divider} />
                </View>
              );
            })}

            <View style={styles.group}>
              <TouchableOpacity
                style={{ width: "100%" }}
                onPress={() => {
                  onClose();
                }}
              >
                <View
                  style={{
                    ...styles.subGroup,
                  }}
                >
                  <Text style={styles.text}>取消</Text>
                </View>
              </TouchableOpacity>
            </View>
          </View>
        </View>
      </Modal>
    );
  }
}
